import { memo } from 'react'
import { Typography } from 'antd'
import { QuestionTitleDefaultProps } from './interface'

const { Title } = Typography

const QuestionTitle = memo(props => {
  const { text, level, isCenter } = { ...QuestionTitleDefaultProps, ...props }

  const genFontSize = (level: any) => {
    switch (level) {
      case 1:
        return '24px'
      case 2:
        return '20px'
      default:
        return '16px'
    }
  }

  return (
    <Title
      level={level}
      style={{
        textAlign: isCenter ? 'center' : 'start',
        marginBottom: 0,
        fontSize: genFontSize(level),
      }}
    >
      {text}
    </Title>
  )
})

export default QuestionTitle
